<template>
<!--    <Modal :mask-closable="false"-->
<!--        v-model="sendInfoVisible"-->
<!--        :title="`${$t('preliminary.AllocationInformation')}`"-->
<!--        :fullscreen="true"-->
<!--        class="modal-content-item-layout"-->
<!--        @on-visible-change="handleVisibleChange"-->
<!--    >-->

  <div class="zy-content">
    <back-level></back-level>
    <Form ref="acceptCheckForm" :model="formItem" label-position="top">
      <Card :title="$t('preliminary.BasicInformation')" class="detail-content-layout">
        <div class="basic-info">
          <div class="basic-info-body">
            <Row style="border-top: 1px solid #eee;border-bottom: 1px solid #eee">
              <Col span="8">
                <FormItem :label="`${$t('preliminary.ContractNumber')}`">
                  <div class="basic-info-body-item">{{ formItem.contractNo }}</div>
                </FormItem>
              </Col>
              <Col span="8">
                <FormItem :label="`${$t('preliminary.EquipmentName')}`">
                  <div class="basic-info-body-item">
                    {{ formItem.deviceName }}
                  </div>
                </FormItem>
              </Col>
              <Col span="8">
                <FormItem :label="`${$t('common.Entity')}`">
                  <div class="basic-info-body-item">{{ formItem.belongCompanyName }}</div>
                </FormItem>
              </Col>
            </Row>
            <Row>
              <Col span="8" style="border-bottom: 1px solid #eee">
                <FormItem :label="`${$t('preliminary.Vendor')}`">
                  <div class="basic-info-body-item">
                    {{ formItem.supplier }}
                  </div>
                </FormItem>
              </Col>
            </Row>
          </div>
        </div>
      </Card>
      <Card :title="$t('preliminary.Input')" class="detail-content-layout mt16">
        <div class="basic-info">
          <div class="basic-info-body">
            <Row style="border-top: 1px solid #eee;">
              <Col span="8">
                <FormItem :label="`${$t('preliminary.Department')}`">
                  <Input v-model="formItem.useDept" :maxlength="200" clearable class="Input-wrapper"/>
                </FormItem>
              </Col>
              <Col span="8">
                <FormItem :label="`${$t('common.Installation')}`" required>
                  <Cascader
                      :data="orgList"
                      :transfer="true"
                      v-model="cascaderID"
                      @on-change="handleCasChange"
                  ></Cascader>
                </FormItem>
              </Col>
              <Col span="8">
                <FormItem :label="`${$t('preliminary.Manufacturer')}`">
                  <Input v-model="formItem.manufacturer" :maxlength="200" clearable
                         class="Input-wrapper"/>
                </FormItem>
              </Col>
            </Row>
            <Row style="border-top: 1px solid #eee;">
              <Col span="8">
                <FormItem :label="`${$t('preliminary.ConfirmingDate')}`">
                  <DatePicker
                      v-model="formItem.arrivalAcceptDate"
                      type="date"
                      format="yyyy-MM-dd"
                      placeholder=""
                      class="Input-wrapper"
                  />
                </FormItem>
              </Col>
              <Col span="8">
                <FormItem :label="`${$t('preliminary.ManufacturingDate')}`">
                  <DatePicker
                      @on-change="produceDateChange"
                      v-model="formItem.produceDate"
                      type="date"
                      format="yyyy-MM-dd"
                      placeholder=""
                      class="Input-wrapper"
                  />
                </FormItem>
              </Col>
              <Col span="8">
                <FormItem :label="`${$t('equipCheck.Model')}`">
                  <Input v-model="formItem.specification" clearable class="Input-wrapper"/>
                </FormItem>
              </Col>
            </Row>
            <Row style="border-top: 1px solid #eee;">
              <Col span="8">
                <FormItem :label="`${$t('preliminary.ManufacturingNumber')}`">
                  <Input v-model="formItem.factoryNo" :maxlength="200" clearable class="Input-wrapper"/>
                </FormItem>
              </Col>
              <Col span="8">
                <FormItem :label="`${$t('ledger.Voltage')}（V）`">
                  <Input v-model="formItem.voltage" clearable class="Input-wrapper"/>
                </FormItem>
              </Col>
              <Col span="8">
                <FormItem :label="`${$t('ledger.EquipmentPower')}`">
                  <Input v-model="formItem.ratedPower" clearable class="Input-wrapper"/>
                </FormItem>
              </Col>
            </Row>
            <Row style="border-top: 1px solid #eee;">
              <Col span="8" style="border-bottom: 1px solid #eee;">
                <FormItem :label="`${$t('ledger.EquipmentWeight')}`">
                  <Input v-model="formItem.weight" clearable class="Input-wrapper"/>
                </FormItem>
              </Col>
              <Col span="8" style="border-bottom: 1px solid #eee;">
                <FormItem :label="`${$t('ledger.AssetNo')}`">
                  <Input v-model="formItem.assetsNo" clearable class="Input-wrapper"/>
                </FormItem>
              </Col>
            </Row>
          </div>
        </div>
      </Card>
      <Card :title="$t('preliminary.Confirm')" class="detail-content-layout mt16">
        <div class="basic-info">
          <div class="basic-info-body">
            <Row>
              <Col span="8" style="border-top: 1px solid #eee;border-bottom: 1px solid #eee">
                <FormItem :label="`${$t('preliminary.ConfimedBy')}`" required>
                  <Select
                      v-model="formItem.acceptName"
                      filterable
                      clearable
                      :placeholder="`${$t('common.selectInfo')}`"
                      :remote-method="getOAList"
                      :loading="loading"
                      class="Input-wrapper"
                  >
                    <Option v-for="(item,index) of OAList"
                            :value="item.id"
                            :key="item.id">{{ item.showName }}
                    </Option>
                  </Select>
                </FormItem>
              </Col>
              <Col span="8" style="border-bottom: 1px solid #eee">
                <FormItem :label="`${$t('preliminary.confirmationResults')}`" required>
                  <RadioGroup v-model="formItem.arrivalResult">
                    <Radio v-for="equ in packages"
                           :key="equ.id"
                           :label="equ.id">{{ equ.value }}
                    </Radio>
                  </RadioGroup>
                </FormItem>
              </Col>
              <Col span="8" style="border-top: 1px solid #eee;border-bottom: 1px solid #eee">
                <FormItem :label="`${$t('preliminary.InformationPackage')}`">
                  <div style="display: flex;justify-content: flex-start;align-items: center">
                    <Upload
                        ref="fileUpload"
                        :show-upload-list="false"
                        :before-upload="handleJSBeforeUpload"
                        type="drag"
                        action=""
                    >
                      <Button type="primary">{{$t('spareParts.Upload')}}</Button>
                    </Upload>
                    <div class="file-list" v-for="(item, index) in formItem.technicalDocumentList" :key="index">
                      <Tag class="item-src"
                           color="blue"
                           type="border"
                           closable
                           @on-close="delFileList(index, 2)"
                           @click.native="handlePreview(item)">
                        {{ item.fileName }}
                      </Tag>
                      <!--                                        <Icon class="item-icon" type="ios-close" size="20" style="float:right;"
                                                                    @click="delFileList(index, 2)" v-if="item">
                                                              </Icon>-->
                    </div>
                  </div>
                </FormItem>
              </Col>
            </Row>
            <Row>

              <Col span="8" style="border-bottom: 1px solid #eee">
                <FormItem :label="`${$t('preliminary.AcceptanceTestInterpretation')}`">
                  <Input v-model="formItem.arrivalDesc" :maxlength="1000" class="Input-wrapper"/>
                </FormItem>
              </Col>
            </Row>
          </div>
        </div>
      </Card>
    </Form>

    <bottom-handle-wrap>
      <Button
          @click="$router.go(-1)">{{$t('preliminary.Cancel')}}</Button>
      <Button style="margin-right: 10px"
              type="primary" :loading="loadingVisible"
              @click="handleSave">{{$t('maintenance.Confirmed')}}</Button>

    </bottom-handle-wrap>
  </div>

<!--      <div slot="footer"></div>-->
<!--    </Modal>-->
</template>

<script>
import { findOrgByToken } from '@/api/index.js'
import recursion from '../../../../util/recursion'

export default {
    name: "addAcceptanceCheckModal",
    data() {
        return {
            downVisible: false,
            loading: false,
            sendInfoVisible: false,
            loadingVisible: false,
            cascaderID:'',
            formItem: {
                // categoryName: '',
                // factoryCenterShowName: '',
                // showName: '',
                // belongShowName: '',
                // acceptShowName: '',
                // arrivalShowName: '',
                // useShowName: '',
            },
            aList: [],//包装图片列表
            pList: [],//外包装图片列表
            packages: [
                {id: 1, value: this.$t('preliminary.PassThrough')},
                {id: 0, value: this.$t('preliminary.Unaccepted')}
            ],
            departList: [{id: this.$t('acceptanceCheck.ProductCenter'), name:this.$t('acceptanceCheck.ProductCenter')}, {id: this.$t('acceptanceCheck.QualityCenter'), name: this.$t('acceptanceCheck.QualityCenter')}, {
                id: this.$t('acceptanceCheck.InformationManagementCenter'),
                name:  this.$t('acceptanceCheck.InformationManagementCenter')
            }, {id: this.$t('acceptanceCheck.AdministrativeManagementCenter'), name: this.$t('acceptanceCheck.AdministrativeManagementCenter')}, {id: this.$t('acceptanceCheck.equipmentCenter'), name: this.$t('acceptanceCheck.equipmentCenter')}],
            mainTypeList: [],
            deviceList: [],//设备类别
            orgList: [],//功能位置
            OAList: [],
            factoryList: [],
            centerList: [],//成本中心
            jiList: [],
            faList: [],
            coneData: [],
            objList: {}
        }
    },
    created() {
      this.show(this.$route.query)
        this.getDeviceList()
        this.getOrgList()
        this.getCompanyList()
    },
  watch: {
        formItem: function (newVal) {
            this.formItem.categoryName = newVal.categoryName
        }
    },
    methods: {
        produceDateChange(val) {
            this.formItem.produceDate = val
        },
        /**************基础数据**********************/
        getCenterList(query) {
            if (query !== '') {
                console.log(query)
                this.loading = true
                this.axios({
                    method: 'get',
                    url: '/tms/tmApplyUse/getCostCenter',
                    params: {
                        companyCode: this.formItem.useCompanyCode,
                        costCenter: query
                    }
                }).then(res => {
                    if (res.code === 200) {
                        this.centerList = res.data.map(center => {
                            return {
                                ...center,
                                ktextName: `${center.kostl}-${center.ktext}`
                            }
                        })
                    } else {
                        this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                    }
                }).finally(() => {
                    this.loading = false
                })
            } else {
                this.centerList = []
            }
        },
        getCompanyList() {
            this.axios({
                method: 'get',
                url: '/basic/company/getCompanyListByUser',
                params: {}
            }).then(res => {
                
                if (res.code === 200) {
                    this.factoryList = res.data
                } else {
                    this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                }
            })
        },
        getDeviceList() {
            this.axios({
                method: 'get',
                url: '/dms/dmsCategory/getSelectList',
                params: {}
            }).then(res => {
                if (res.code === 200) {
                    this.deviceList = res.data.map(item => {
                        return {
                            ...item,
                            value: item.value.toString()
                        }
                    })
                } else {
                    this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                }
            })
        },
        getSearchDeviceList(query) {
            if (query !== '') {
                console.log(query)
                this.loading = true
                this.axios({
                    method: 'get',
                    url: '/dms/dmsCategory/getDmsSmallCategory',
                    params: {
                        name: query
                    }
                }).then(res => {
                    if (res.code === 200) {
                        this.deviceList = res.data
                    } else {
                        this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                    }
                }).finally(() => {
                    this.loading = false
                })
            } else {
                this.deviceList = []
            }
        },
        getOrgList() {
            let params = {
                level: 3
            }
            findOrgByToken(params).then(res => {
                if (res.code === 200) {
                    const obj = {
                        label: 'name',
                        value: 'id',
                        children: 'children'
                    }
                    this.orgList = recursion.convertTree(res.data, obj)
                    this.coneData = res.data
                } else {
                    this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                }
            })
        },
        getOAList(query) {
          if (typeof(query) === "string" && query.indexOf('----') > 0){
            return
          }
            if (query !== '') {
                this.loading = true
                this.axios({
                    method: 'get',
                    url: '/basic/user/searchOAUser',
                    params: {
                        key: query
                    }
                }).then(res => {
                    if (res.code === 200) {
                        this.OAList = res.data.map(item => {
                            return {
                                ...item,
                                showName: item.empno + '----' + item.username
                            }
                        })
                    } else {
                        this.OAList = []
                        this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                    }
                }).finally(() => {
                    this.loading = false
                })
            }
        },
        show(record) {
            this.sendInfoVisible = true
            // if (record.arrivalStatus != 0) {
            //     this.afterDetail(record)
            // }else {
            //     this.aList = []
            //     this.pList = []
            //     this.getDetail(record)
            // }
            this.getDetail(record)
        },
      filterData(arr, id) {
        let temp = [];
        let callback = function (nowArr, id) {
          for (let item of nowArr) {
            if (item.id === id) {
              temp.unshift(item.id);
              callback(arr, item.parentId)
              break;
            } else {
              if (item.children && item.children.length) {
                callback(item.children, id);
              }
            }
          }
        };
        callback(arr, id)
        return temp
      },
        getDetail(record) {
            this.objList = record
            this.axios({
                method: 'post',
                url: '/dms/dmsArrivalCheck/getArrivalCheckViewData',
                params: {
                    dmsDeviceId: record.id
                }
            }).then(res => {
                
                if (res.code == 200) {
                    this.$nextTick(() => {
                      if (res.data[0].orgId) {
                        const arr = this.filterData(this.coneData, res.data[0].orgId)
                        this.cascaderID = [...arr]
                      }
                      if (res.data[0].arrivalAcceptBy){
                        this.getOAList(res.data[0].arrivalAcceptBy)
                      }
                        let center = res.data.costCenter ? res.data.costCenter.indexOf('-') : ''
                        this.formItem = res.data[0]
                        this.formItem.acceptName = res.data[0].arrivalAcceptBy
                        this.formItem.arrivalNum = res.data.arrivalNum ? res.data.arrivalNum : 1
                        this.formItem.categoryId = res.data.categoryId
                        this.formItem.tempOrgId = recursion.treeFindPath(this.orgList, node => node.value == res.data.orgId)
                        if (res.data.belongCompanyAdminNo || res.data.belongCompanyAcceptorNo || res.data.arrivalFacAcceptorNo || res.data.useCompanyAcceptorNo || res.data.factoryEngineerAdminNo || res.data.costCenter) {
                            this.formItem.belongShowName = res.data.belongCompanyAdminNo + '----' + res.data.belongCompanyAdminName //设备管理员
                            this.formItem.acceptShowName = res.data.belongCompanyAcceptorNo + '----' + res.data.belongCompanyAcceptorName //所属公司验收人
                            this.formItem.arrivalShowName = res.data.arrivalFacAcceptorNo + '----' + res.data.arrivalFacAcceptorName //厂务中心验收人
                            this.formItem.useShowName = res.data.useCompanyAcceptorNo + '----' + res.data.useCompanyAcceptorName //使用公司验收人
                            this.formItem.factoryCenterShowName = res.data.factoryEngineerAdminNo + '----' + res.data.factoryEngineerAdminName //厂务中心资产管理工程师
                            this.formItem.showName = res.data.costCenter
                            this.getOAList(res.data.belongCompanyAdminNo)
                            this.getOAList(res.data.belongCompanyAcceptorNo)
                            this.getOAList(res.data.arrivalFacAcceptorNo)
                            this.getOAList(res.data.useCompanyAcceptorNo)
                            this.getOAList(res.data.factoryEngineerAdminNo)
                            this.getCenterList(res.data.costCenter.substr(0, center))
                        }

                        if (res.data.categoryName) {
                            this.formItem.categoryName = String(res.data.categoryName)
                            this.getSearchDeviceList(res.data.categoryName)
                            this.$refs.setQuery.setQuery(res.data.categoryName)
                        }

                    })
                }
            })
        },
        afterDetail(record) {
            this.axios({
                method: 'get',
                url: '/dms/dmsDevice/getDwysLater',
                params: {
                    deviceMId: record.deviceMId
                }
            }).then(res => {
                
                if (res.code == 200) {
                    this.$nextTick(() => {
                        let center = res.data.costCenter ? res.data.costCenter.indexOf('-') : ''
                        this.formItem = res.data
                        this.aList = res.data.sbwgList
                        this.pList = res.data.wbzList
                        this.formItem.categoryId = res.data.categoryId
                        this.formItem.tempOrgId = recursion.treeFindPath(this.orgList, node => node.value === res.data.orgId)
                        if (res.data.belongCompanyAdminNo || res.data.belongCompanyAcceptorNo || res.data.arrivalFacAcceptorNo || res.data.useCompanyAcceptorNo || res.data.factoryEngineerAdminNo || res.data.costCenter) {
                            this.formItem.belongShowName = res.data.belongCompanyAdminNo + '----' + res.data.belongCompanyAdminName //设备管理员
                            this.formItem.acceptShowName = res.data.belongCompanyAcceptorNo + '----' + res.data.belongCompanyAcceptorName //所属公司验收人
                            this.formItem.arrivalShowName = res.data.arrivalFacAcceptorNo + '----' + res.data.arrivalFacAcceptorName //厂务中心验收人
                            this.formItem.useShowName = res.data.useCompanyAcceptorNo + '----' + res.data.useCompanyAcceptorName //使用公司验收人
                            this.formItem.factoryCenterShowName = res.data.factoryEngineerAdminNo + '----' + res.data.factoryEngineerAdminName //厂务中心资产管理工程师
                            this.formItem.showName = res.data.costCenter
                            this.getOAList(res.data.belongCompanyAdminNo)
                            this.getOAList(res.data.belongCompanyAcceptorNo)
                            this.getOAList(res.data.arrivalFacAcceptorNo)
                            this.getOAList(res.data.useCompanyAcceptorNo)
                            this.getOAList(res.data.factoryEngineerAdminNo)
                            this.getCenterList(res.data.costCenter.substr(0, center))
                        }

                        if (res.data.categoryName) {
                            this.formItem.categoryName = String(res.data.categoryName)
                            this.getSearchDeviceList(res.data.categoryName)
                            this.$refs.setQuery.setQuery(res.data.categoryName)
                        }
                    })
                }
            })
        },
        //设备类别
        deviceChange(val) {
            console.log(val)
            this.axios({
                method: 'get',
                url: '/dms/dmsCategory/getDmsSmallCategory',
                params: {
                    name: val.value
                }
            }).then(res => {
                if (res.code === 200) {
                    this.formItem.categoryId = res.data[0].id
                } else {
                    this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                }
            }).finally(() => {
            })
            // this.getSearchDeviceList(val)
            // this.formItem.categoryName = val.label
        },
        handleCasChange(val, selectedData) {
            console.log(selectedData);
            this.formItem.orgId = val[val.length - 1]
            this.formItem.orgName = selectedData[selectedData.length - 1].label
        },
        //使用公司
        handleUseCompanyChange(val) {
            console.log(val)
            this.formItem.useCompanyCode = this.factoryList.filter(item => item.id == val)[0].code
        },
        //文件删除
        delFileList(id, type) {
            if (type === 1) {
                this.formItem.fhqdList = this.formItem.fhqdList.filter((item, index) => index != id)
            } else if (type === 2) {
                this.formItem.technicalDocumentList = this.formItem.technicalDocumentList.filter((item, index) => index !== id);
            } else if (type === 4) {
                this.pList = this.pList.filter((item, index) => index != id)
            } else {
                this.aList = this.aList.filter((item, index) => index != id)
            }
        },

        //发货清单上传
        handlefhBeforeUpload(file) {
            console.log(file)
            let formData = new FormData();
            formData.append("dir", 'device')
            formData.append("file", file)
            let config = {
                headers: {
                    "Content-Type": "multipart/form-data"
                }
            };
            this.axios({
                method: 'post',
                url: '/fileServer/upload',
                data: formData,
                config,
            }).then(res => {
                if (res.code == 200) {
                    this.formItem.deliveryBillList.push({
                        fileName: res.data.fileName,
                        filePath: res.data.filepath,
                        fileUrl: res.data.fileUrl
                    })
                    this.faList = this.formItem.deliveryBillList
                }
            })
            return false;
        },
        //外包装上传
        handlePackageBeforeUpload(file) {
            console.log(file)
            let formData = new FormData();
            formData.append("dir", 'device')
            formData.append("file", file)
            let config = {
                headers: {
                    "Content-Type": "multipart/form-data"
                }
            };
            this.axios({
                method: 'post',
                url: '/fileServer/upload',
                data: formData,
                config,
            }).then(res => {
                if (res.code == 200) {
                    this.pList.push({
                        fileName: res.data.fileName,
                        filePath: res.data.filepath,
                        fileUrl: res.data.fileUrl
                    })
                }
            })
            return false;
        },
        //设备外观上传
        handleAppearanceBeforeUpload(file) {
            console.log(file)
            let formData = new FormData();
            formData.append("dir", 'device')
            formData.append("file", file)
            let config = {
                headers: {
                    "Content-Type": "multipart/form-data"
                }
            };
            this.axios({
                method: 'post',
                url: '/fileServer/upload',
                data: formData,
                config,
            }).then(res => {
                if (res.code == 200) {
                    this.aList.push({
                        fileName: res.data.fileName,
                        filePath: res.data.filepath,
                        fileUrl: res.data.fileUrl
                    })
                }
            })
            return false;
        },
        handleJSBeforeUpload(file) {
            console.log(file)
            let formData = new FormData();
            formData.append("dir", 'device')
            formData.append("file", file)
            let config = {
                headers: {
                    "Content-Type": "multipart/form-data"
                }
            };
            this.axios({
                method: 'post',
                url: '/fileServer/upload',
                data: formData,
                config,
            }).then(res => {
                if (res.code == 200) {
                    this.formItem.technicalDocumentList.push({
                        fileName: res.data.fileName,
                        filePath: res.data.filepath,
                        fileUrl: res.data.fileUrl
                    })
                }
            })
            return false;
        },
        handleSave() {
            if (!this.formItem.orgId) {
                this.$Message.warning(({content:  this.$t('acceptanceCheck.inputPosition'), duration: 6, closable: true}))
                return false
            }

            if(!this.formItem.acceptName){
                this.$Message.warning(({content:  this.$t('acceptanceCheck.inputConfirmBy'), duration: 6, closable: true}))
                return false
            }
            let params = {
                id: this.objList.id,
                deviceMId: this.objList.deviceMId,
                dmsPurchaseId: this.objList.dmsPurchaseId,
                dmsDeliveryId: this.objList.dmsDeliveryId,
                useDept: this.formItem.useDept,
                orgId: this.formItem.orgId,
                orgName: this.formItem.orgName,
                arrivalAcceptDate: this.formItem.arrivalAcceptDate ? this.$moment(this.formItem.arrivalAcceptDate).format('YYYY-MM-DD') : '',
                manufacturer: this.formItem.manufacturer,
                produceDate: this.formItem.produceDate ? this.$moment(this.formItem.produceDate).format('YYYY-MM-DD') : '',
                factoryNo: this.formItem.factoryNo,
                useCompanyId: this.formItem.useCompanyId,
                useCompanyName: this.factoryList.find(val => val.id === this.formItem.useCompanyId).name,
                voltage: this.formItem.voltage,
                ratedPower: this.formItem.ratedPower,
                weight: this.formItem.weight,
                assetsNo: this.formItem.assetsNo,
                specification: this.formItem.specification,
                // arrivalAcceptBy: this.OAList.find(val => val.showName === this.formItem.acceptName).id,
                arrivalAcceptBy: this.formItem.acceptName,
                // arrivalAcceptName: this.formItem.acceptName.split('----')[1],
                arrivalAcceptName: this.OAList.find(val => val.id === this.formItem.acceptName).username,
                arrivalResult: this.formItem.arrivalResult,
                technicalDocumentList: this.formItem.technicalDocumentList,
                arrivalDesc: this.formItem.arrivalDesc,
            }
            this.axios({
                method: 'post',
                url: '/dms/dmsArrivalCheck/arrivalCheck',
                data: params
            }).then(res => {
                if (res.code === 200) {
                    this.$emit('handleFresh')
                    // this.sendInfoVisible = false
                    // this.$refs.acceptCheckForm.resetFields();
                  this.$router.go(-1)
                    this.$Message.success(({content: this.$t('acceptanceCheck.SaveSuccessfully'), duration: 3, closable: true}));
                } else {
                    this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                }
            }).finally(() => {
                this.loadingVisible = false
            })


        },
        handleVisibleChange(val) {
          if (!val){
            this.formItem.orgId = ''
          }
        },
        handlePreview(item) {
            if (item) {
                window.open(this.util.filePathToUrl(item.filePath));
            }
        },
    }
}
</script>

<style scoped lang="scss">
::v-deep.ivu-upload-drag{
  border: none !important;
}
::v-deep .ivu-form-item-content{
  margin-bottom: 0;
  // margin-left: 5px !important;
  line-height: 8px;
}
.basic-info {
    .basic-info-title {
        span {
            display: inline-block;
            width: 7px;
            height: 24px;
            background: #187bdb;
        }

        h2 {
            display: inline-block;
            font-size: 16px;
            padding-left: 10px;
            position: relative;

            &::before {
                content: "";
                position: absolute;
                left: 0;
                top: 0;
                width: 7px;
                height: 24px;
                background: #187bdb;
            }
        }
    }
  // ::v-deep .ivu-form-item-content{
  //   margin-bottom: 0;
  //   margin-left: 5px !important;
  // }
  // ::v-deep .ivu-form-item-label{
  //   margin-bottom: 0;
  //   padding: 15px 12px 10px 0 !important;
  //   background: #f5f6f7;
  //   text-align: right;
  //   border-right: 1px solid #eee;
  // }

  ::v-deep .ivu-form-item {
    // display: flex;
    align-items: center;
    margin-bottom: 0;
    border-right: 1px solid #eee;
  }
    .basic-info-body {
        margin: 10px;
        color: #333;
        font-size: 13px;
        font-family: 'Arial Normal', 'Arial', sans-serif;
        font-weight: 400;
        border-left: 1px solid #eee;

        .basic-info-body-label {
            display: inline-block;
            width: 40%;
            height: 48px;
            line-height: 48px;
            background: #f5f6f7;
            text-align: right;
            padding-right: 10px;
            /*border-left: 1px solid #B6B7B7;*/
            /*border-top: 1px solid #B6B7B7;*/
            /*border-bottom: 1px solid #B6B7B7;*/
        }

        .basic-info-body-item {
            /*display: inline-block;*/
            /*width: 60%;*/
            /*height: 48px;*/
            /*line-height: 48px;*/
            /*text-align: left;*/
            // padding: 0 10px;
            /*border-left: 1px solid #eee;*/
            /*border-right: 1px solid #eee;*/
            /*border-right: 1px solid #B6B7B7;*/
            /*border-top: 1px solid #B6B7B7;*/
            /*border-bottom: 1px solid #B6B7B7;*/
        }
    }
}

.preview {
    position: absolute;
    right: 10px;
    top: 0;
    width: 35px;
    height: 35px;
    background: #eee;

    .preview-img {
        width: 35px;
        height: 35px;
        overflow: hidden;
    }
}

::v-deep .ivu-form-item-content {
    margin-bottom: 0;
    padding: 0 10px;
    height: 48px;
    width: 100%;
    display: flex;
    align-items: center;
}
::v-deep .ivu-form-item-label {
    margin-bottom: 0;
    padding: 0 10px;
    background: #f5f6f7;
    height: 48px;
    text-align: left;
    width: 100%;
    border-right: 1px solid #eee;
    display: flex;
    align-items: center;
}


::v-deep .Input-wrapper {
    width: 95%;
    margin: 0 10px;

    .ivu-select-selection {
        height: 30px;
        border: none;
        box-shadow: none;
    }

    .ivu-input {
        border: none;
        box-shadow: none;
    }
}

.btn-wrapper {
    position: relative;

    .btn-action {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        top: 100px;
    }
}

.upload-wrapper {
    display: inline-block;
    position: relative;

    span {
        display: inline-block;
        width: 100px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-bottom: -8px;
        line-height: 26px;
    }

    .upload-action {
        display: none;
        position: absolute;
        left: 0;
        right: 0;
        top: -1px;
        bottom: 0px;
        background: rgba(0, 0, 0, .6);

        i {
            cursor: pointer;
            margin: 0 10px;
        }
    }

    &:hover {
        .upload-action {
            display: inline-block;
        }
    }
}

::v-deep .ivu-upload {
    //margin-bottom: -12px;
    display: inline-block;
}

.over-wrapper {
    width: 200px;
    height: 23px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

::v-deep .ivu-select-selected-value {
    background: #ffffff;
    color: #333333;
}

::v-deep .ivu-input-disabled {
    background: #ffffff;
    color: #333333;
}

::v-deep .ivu-select-placeholder {
    background: #ffffff;
    color: #333333;
}

::v-deep .ivu-select-input {
    background: #fff;
    height: 30px;
}

::v-deep .ivu-cascader .ivu-input {
    border: 0;
    box-shadow: none;
}

.file-list {
    width: 50%;
    margin: 0 20px;

    .item-src {
        display: inline-block;
        line-height: 26px;
        color: #187bdb;
        cursor: pointer;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .item-icon {
        width: 20%;
        display: inline-block;
        margin-top: 4px;
    }
}
</style>
